<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="vue.min.js"></script>
    <link href="common.css" rel="stylesheet" />
</head>
<body>
<div id="div1">
    <!--遍历对象数组-->
    <div v-for="item in list">
        {{item.id}}
    </div>
    <div v-for="val in obj1">
        {{val}}
    </div>

    <!--遍历对象最多可以接收三个参数，且按照顺序为值、键、索引-->
    <div v-for="(value,key,index) in obj1">
        {{value}}:{{key}}:{{index}}
    </div>

    <!--表达式接收参数的顺序是固定的，而不取决于你的变量名，比如下面例子可以看出最后每一个div显示的value其实是遍历的索引-->
    <div v-for="(key,index,value) in obj1">
        {{value}}:{{key}}:{{index}}
    </div>

    <!--遍历整数-->
    <div v-for="num in 3">
        {{num}}
    </div>
</div>
<script>
    var vm =  new Vue({
        el:"#div1",
        data:{
            list:[
                {id:1},
                {id:2},
                {id:3}
            ],
            obj1:{
                name:"lhr",
                age:25
            }
        }
    })
</script>
</body>
</html>